<%@ page contentType="text/html; charset=utf-8" language="java"
	pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=8" />
<meta name="author" content="cfuture" />
<title>${MainModel.title}</title>
<jsp:include page="css.jsp" />
<jsp:include page="javascript.jsp" />
 <style type="text/css">
 
 
.centerFontOne{
	background-image:url("${BaseURL}_css/images/welcome/welFontOne.png");
	background-repeat:no-repeat;
	width:299px;
	height:116px;
	margin-top:80px;
	position:absolute;
	left: 35%;
}
.centerFontTitle{
	/*  background-image:url("${BaseURL}_css/images/welcome/welTitleShow.png");*/
	background-repeat:no-repeat;
	width:542px;
	height:83px;
	margin-top:100px;
	filter:alpha(opacity =0);
	position:absolute;
	left: 30%;
}
.centerFontTitlebackground{
	display:none; 
	background-image:url("${BaseURL}_css/images/welcome/welTitleShowbackground.png");
	background-repeat:no-repeat;
	width:542px;
	height:274px;
	margin-top:183px;
	position:absolute;
	left: 30%;
}

.leftTitleStyle{
	background-image:url("${BaseURL}_css/images/welcome/welcomeLoginLeft.png");
	background-repeat:no-repeat;
	width:150px;
	height:61px;
	filter:alpha(opacity =0);
	position:absolute;
	left:30px;
	top:20px;
}

.showNoticeWelStyle{
	width:514;
	height:auto;
	font-size:14px;
	font-family:'宋体';
	color:#636363;
	line-height:16px;
	text-align:left;
	filter:alpha(opacity =0);
	margin-top:183px;
	position:absolute;
	left: 31%;
}
  </style>
<script type="text/javascript">
	$(function() {
		DWZ.init("${BaseURL}dwzres/dwz.frag.xml", {
			
			//loginUrl:"../loginsub.jsp", loginTitle:"登录",	// 弹出登录对话框 
			//loginUrl:"../login",	// 跳到登录页面
			statusCode : {
				ok : 200,
				error : 300,
				timeout : 301
			}, //【可选】
			pageInfo : {
				pageNum : "pageNum",
				numPerPage : "numPerPage",
				orderField : "orderField",
				orderDirection : "orderDirection"
			}, //【可选】
			debug : false, // 调试模式 【true|false】
			callback : function() {
				initEnv();
				$("#themeList").theme({
					themeBase : "themes"
				});
			}
		});
	});
	

	  function fadeIn(el){
			el.style.opacity = 0;
			el.style.filter = 'alpha(opacity = 0)';
			el.style.display = 'block';
			var n = 0;
			function fadeShow(){
				if (n < 1){
					n += 0.1;
					el.style.opacity = n;
					el.style.filter = 'alpha(opacity = '+n*100+')';
					var setTimeId = setTimeout(fadeShow, 50);
				}else{
					el.style.opacity = 1;
					el.style.filter = 'alpha(opacity = 100)';
					clearTimeout(setTimeId);
				}
			}
			fadeShow();
		}
		function fadeOut(el){
			el.style.opacity = 1;
			el.style.filter = 'alpha(opacity = 100)';
			var n = 1;
			function fadeHide(){
				if (n > 0){
					n -= 0.1;
					el.style.opacity = n;
					el.style.filter = 'alpha(opacity = '+n*100+')';
					var setTimeId = setTimeout(fadeHide, 50);
				}else{
					el.style.opacity = 0;
					el.style.filter = 'alpha(opacity = 0)';
					clearTimeout(setTimeId);
					el.style.display = 'none';
				}
			}
			fadeHide();
		}

	

	
</script>
</head>

<body scroll="no">
	<div id="layout">
		<div id="header">
			<div class="headerNav">
				<%-- <a class="logo1" style="top:10px; color:#AAA; font-size:30px;" href="#">${MainModel.title}</a> --%>
				<span style="top:10px;line-height:44px; color:#CCC; font-size:30px;">&nbsp;${MainModel.title}</span>
				<ul class="nav">
					<li><a href="javascript:;">欢迎 [<b>${loginUser.account}</b>]
					</a></li>
				<%--	<li><a href="${BaseURL}index.jsp" target="_blank">浏览首页</a></li>--%>
					<li><a href="${BaseURL}users/profile" target="dialog" height="380">[我的资料]</a></li>
					<li><a href="${BaseURL}users/logout"
						onclick="var f = document.createElement('form');f.style.display = 'none'; this.parentNode.appendChild(f); f.method='POST'; f.action = this.href; var m = document.createElement('input');m.setAttribute('type','hidden');m.setAttribute('name','_method');m.setAttribute('value','put'); f.appendChild(m);f.submit();return false;">[退出]</a></li>
					<%-- <li><a href="${BaseURL}main/about-us" target="dialog">关于</a></li> --%>
				</ul>
				<ul class="themeList" id="themeList">
					<li theme="default"><div class="selected">蓝色</div></li>
					<li theme="green"><div>绿色</div></li>
					<li theme="purple"><div>紫色</div></li>
					<li theme="silver"><div>银色</div></li>
					<li theme="azure"><div>天蓝</div></li>
				</ul>
			</div>

			<div id="navMenu">
				<ul>
					<c:forEach var="navMenu" items="${MainModel.navMenus}">
						<li><a href="${BaseURL}${navMenu.href}"><span>${navMenu.name}</span></a></li>
					</c:forEach>
				</ul>
			</div>
		</div>

		<div id="leftside">
			<div id="sidebar_s">
				<div class="collapse">
					<div class="toggleCollapse">
						<div></div>
					</div>
				</div>
			</div>
			<div id="sidebar">
				<div class="toggleCollapse">
					<h2>控制板</h2>
					<div>收缩</div>
				</div>
				<div class="accordion" fillSpace="sideBar">
					${MainModel.treeMenus}</div>

			</div>
		</div>
		<div id="container">
			<div id="navTab" class="tabsPage">
				<div class="tabsPageHeader">
					<div class="tabsPageHeaderContent">
						<!-- 显示左右控制时添加 class="tabsPageHeaderMargin" -->
						<ul class="navTab-tab">
							<li tabid="main" class="main"><a href="javascript:;"><span><span
										class="home_icon">桌面</span></span></a></li>
						</ul>
					</div>
					<div class="tabsLeft">left</div>
					<!-- 禁用只需要添加一个样式 class="tabsLeft tabsLeftDisabled" -->
					<div class="tabsRight">right</div>
					<!-- 禁用只需要添加一个样式 class="tabsRight tabsRightDisabled" -->
					<div class="tabsMore">more</div>
				</div>
				<ul class="tabsMoreList">
					<li><a href="javascript:;">桌面</a></li>
				</ul>
				<div class="navTab-panel tabsPageContent" id="myContent">
					<div class="page">
						<div class="pageContent">
							<div style="overflow: auto; width: 100%; height: 100%; background: #ccc;"></div>
								
								
								
								
								
								
								
						</div>
						
						  <div style="width:100%;height:100%; display:table-cell; align:center; text-align: center; z-index:9999; position:absolute;">
								  			<div id="showCenterOne" class="centerFontOne"></div>
								  			<div id="showCenterTitle" class="centerFontTitle"></div>
								  			<div id="leftTitle" class="leftTitleStyle"></div>
								  			<div id="showNoticeWel" class="showNoticeWelStyle">
								  			欢迎您访问[${MainModel.title}]<br>
											您可以在系统顶部的导航栏菜单切换不同的业务分类 <br>
											然后在左侧的控制板中选择您想要进行的业务<br>  			
								  			</div>
								   	</div>
								  <div id="underColor" class="footerUnderBg" ></div>
								  <div class="footerStyleBg" ></div>
						
					</div>
				</div>
			</div>
		</div>

		<div id="taskbar" style="left: 0px; display: none;">
			<div class="taskbarContent">
				<ul></ul>
			</div>
			<div class="taskbarLeft taskbarLeftDisabled" style="display: none;">taskbarLeft</div>
			<div class="taskbarRight" style="display: none;">taskbarRight</div>
		</div>
		<div id="splitBar"></div>
		<div id="splitBarProxy"></div>
	</div>

	<div id="footer">${MainModel.copyRight}</div>

	<!--拖动效果-->
	<div class="resizable"></div>
	<!--阴影-->
	<div class="shadow" style="width: 508px; top: 148px; left: 296px;">
		<div class="shadow_h">
			<div class="shadow_h_l"></div>
			<div class="shadow_h_r"></div>
			<div class="shadow_h_c"></div>
		</div>
		<div class="shadow_c">
			<div class="shadow_c_l" style="height: 296px;"></div>
			<div class="shadow_c_r" style="height: 296px;"></div>
			<div class="shadow_c_c" style="height: 296px;"></div>
		</div>
		<div class="shadow_f">
			<div class="shadow_f_l"></div>
			<div class="shadow_f_r"></div>
			<div class="shadow_f_c"></div>
		</div>
	</div>
	<!--遮盖屏幕-->
	<div id="alertBackground" class="alertBackground"></div>
	<div id="dialogBackground" class="dialogBackground"></div>

	<div id='background' class='background'></div>
	<div id='progressBar' class='progressBar'>数据加载中，请稍等...</div>
	
	
 <script type="text/javascript" pagedata="false">	
		  var timerFlag = null;	 
	  var timerFlagIn = null;
	  var timerFlagOut = null;
	  var timerToolOut = null;
	  var timerFontIn = null;
	  var showCenterOne,
	      showCenterTitle,
	      leftTitle,
	      showNoticeWel;

		$(function() {
		  showCenterOne = document.getElementById("showCenterOne"),
	      showCenterTitle = document.getElementById("showCenterTitle"),
	      leftTitle = document.getElementById("leftTitle"),
	      showNoticeWel = document.getElementById("showNoticeWel");
		  fadeIn(showCenterOne);
		});
	  function fadeEff(){
		  clearTimeout(timerFlag);
		  timerFlag = setTimeout(fadeOutBrige,3000);
		  timerFlagIn = setTimeout(fadeInBrigeTitle,4000);
		  timerFlagOut = setTimeout(leftFadeOutTitle,6000);
		  timerFontIn = setTimeout(centerFontIn,6000);
		  
		  //timerFlagOut = setTimeout(fadeOutBrigeTitle,9000);
		// timerToolOut = setTimeout(fadeInTools,9000);
		  }
	 	function fadeOutBrige(){
			this.fadeOut(showCenterOne);
		 }	
	 	function fadeInBrigeTitle(){
			this.fadeIn(showCenterTitle);
	 	} 
	 	function fadeOutBrigeTitle(){
			this.fadeOut(showCenterTitle);
	 	} 
	 	function leftFadeOutTitle(){
			this.fadeIn(leftTitle);
	 	}	
	 	function centerFontIn(){
			this.fadeIn(showNoticeWel);
	 	}
	 	
	 	
	 	$(function() {
		  fadeEff();
	  });		
	  </script>
</body>
</html>